import { Avatar, Col } from 'antd'
import AIAvatar from "@/assets/kimi_avatar_keep_light.png"
import userAvatar from "@/assets/user_avatar.png"
import ReactMarkdown from 'react-markdown';

const ChatItem = ({item}) => {
  return (
    <Col className="chat-item">
      <Col className="chat-item-content">
        <Col
          className={[
            'chat-content-line',
            item.type == 'system' ? '' : 'chat-content-right',
          ]}
        >
          <Avatar  style={{ width: '40px', height: '40px' , flexShrink:0}} src={item.type === 'system'? AIAvatar : userAvatar} />
          <Col className="message-box">
            <ReactMarkdown children={item.content} />
          </Col>
        </Col>
      </Col>
      <Col className="chat-empty"></Col>
    </Col>
  )
}

export default ChatItem
